<template>
    <div class="page mineFocunsOn-page" data-page="mineFocunsOn" style="z-index: 2;">
        <div class="link-page-nav">
            <a href="#" class="link" @click="$root.backToTab()">
                <i class="iconfont icon-zuo"></i>
            </a>
        </div>
        <div class="link-page-top" style="padding-bottom: 17px;">
            <div class="link-page-title">我的关注</div>
        </div>
        <div class="page-content infinite-scroll-content ptr-content"
            data-infinite-distance="50" 
            @infinite="loadMore"
            @ptr:refresh="refreshCurrentList"
            style="padding-bottom: 100px;">
            <div class="ptr-preloader">
                <div class="preloader color-multi"></div>
                <div class="ptr-arrow"></div>
            </div>
            <div class="list media-list">
                <ul class="eachList" id="typeKeyIssList"></ul><!-- 重大问题类 -->
                <ul class="eachList history-police-list" id="typeHisPolList"></ul><!-- 接处警 -->
                <ul class="eachList" id="typeEqList"></ul><!-- 设施监测 -->
                <ul class="troubleApply-list" id="typeTroubleList"></ul><!--隐患 -->
                <ul class="eachList" id="typeVideoList"></ul><!-- 视频 -->
                <div id="f_preloader" class="preloader infinite-scroll-preloader"></div>
            </div>
        </div>
    </div>
</template>

<script>
    return {
        mounted() {
            let self = this;
            self.tabId = self.$route.params.tabId;
            self.type = self.$route.params.type;
        },
        data: function () {
            return {
            	//设施监测
                tabId:0,
                type:null,
                listIndex: 0,
                listSize: 25,
                nineFcfId:"",
                allowInfinite: true,

                //重大安全类
                tabID:null,
                isInfinite:true,
                noDealNum:"",
                hasDealNum:"",
                
                //接处警
                historyOrgId: 0,
                historyList:[],
                allowInfinite: true,
                fireSystemId:-1,//获取全部填-1
                fireBuildingStructureId:0,//消防建筑物id（包含子集） 获取全部填0
                fcfCategoryId:-1,//设备类别-1;
                fireTTypes:-1,//-1全部 0:正常 10:火警, 20:故障,30:屏蔽
                startTime:'',
                endTime:'',
                selectContent:'',
                selectOptionOrg : "",
                selectOptionDec : "",
                isRest:-1,
                isDeal:"",
                
                //隐患
                categoryId:0,//全部类别
	            gradeId:0,//全部等级
	            selectContent:'',//搜索内容
	            startTimeStr:"",
	            endTimeStr:"",
	            dshiqi : null,
	            gifPath: staticPath+"img/apply/voicePlay.gif",
	            imgPath: staticPath+"img/apply/voicePlay.png" ,
	            noimgPath:staticPath+"img/apply/novoicePlay.png",
	            selectOptionIndex:'',
	            selectFlag:false,
	            //隐患类别
	            categoryselectOptionIndex : '',
	            gradeselectOptionIndex : '',
	            selectOptionOrg : "",
	            test:null,
                
                //视频
                vedioData:null,//当前需要置顶的列表项数据
                currentOrgId:0,
                pageIndex:0,
                pageSize:25,
                isloadMore:true,
                name:'',
                vedioLocationType:'',
                moreUnitlist:[],
                positionType:"",//建筑物结构id
                selectOptionOrg : "",
            }
        },
        methods: {
            backToRefresh:function(){
                let self = this;
                self.showCurrentList();
            },
            //九小用户登录 获取九小用户消防设施
            getNineMarkData:function(){
                let self = this;
                let fcfIdArr = [];
                Dao.selectVenuesRelateInfo_ajax({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    venuesId: nineCode,
                    relateObjType:1
                },function(data){
                    if(data && data.fcfsList.length>0){
                        for(let i=0;i<data.fcfsList.length;i++){
                            fcfIdArr.push(data.fcfsList[i].id);
                        }
                        self.nineFcfId = fcfIdArr.toString();
                    }
                },false);
            },
            //获取消防设施
            getFocusFromEq:function(){
                let self = this;
                Dao.equipment({
                    orgIds:userInfor.organizationIds,
                    userName:userInfor.accountName,
                    deviceId:appKeyObj.deviceId,
                    userAccount:userInfor.accountName,
                    type:"1"
                }, function (data,total) {
                    let datalist = data;
                    let dealResultHtml='';
                    if (datalist&&datalist.length > 0) {
                        if(total < self.listSize){
                            $('#f_preloader').hide();
                            self.allowInfinite=false;
                        }else{
                            $('#f_preloader').show();
                            self.allowInfinite=true;
                        }
                        if (datalist.length > 0) {
                            for (let i = 0; i < datalist.length; i++) {
                                let logoimage = datalist[i].icon;
                                if (logoimage == "" || typeof(logoimage) == "undefined") {
                                    logoimage = staticPath + "img/mine/defEqIcon.png";
                                }else {
                                    logoimage = JSON.parse(datalist[i].icon).detailIcon;
                                }
                                if(data[i].handleStatus==-1 && (data[i].fireTType==10 || data[i].fireTType==20 || data[i].fireTType==30 || data[i].fireTType==40)){
                                    dealResultHtml=`&nbsp;&nbsp;&nbsp;未处理`;
                                }else if(data[i].handleStatus==1 && (data[i].fireTType==10 || data[i].fireTType==20 || data[i].fireTType==30 || data[i].fireTType==40)){
                                    dealResultHtml=`&nbsp;&nbsp;&nbsp;已处理`;
                                }else if(data[i].handleStatus==2 && (data[i].fireTType==10 || data[i].fireTType==20 || data[i].fireTType==30 || data[i].fireTType==40)) {
                                    dealResultHtml=`&nbsp;&nbsp;&nbsp;处理中`; 
                                }                   
                                $("#typeEqList").append(`
                                <li>
                                    <div class="decter-stuts-con">
                                        <span class='left'>
                                            <i id="fireType-`+datalist[i].id+`" class="iconfont `+transNewFireIcon(datalist[i].fireTType)+`" style="color:`+transFireColor(datalist[i].fireTType)+`"></i>
                                            `+transFireColorText(datalist[i].fireTType)+dealResultHtml+ `
                                        </span>
                                    </div>
                                    <a href="/eqmentMsg/` + datalist[i].concemId + `/" class="item-link item-content" data-view=".view-main">
                                    <div class="item-inner" style="padding: 0;">
                                        <div class="item-title-row" style="padding-right: 0;">
                                            <div class="item-title decter-name-con">
                                                <span class="decter-name">`+common.transNullundefinedToline(datalist[i].fcfName)+ `</span>
                                            </div>
                                        </div>
                                        <div class="item-subtitle decter-mesage">` + common.transNullundefined(datalist[i].location) + `</div>
                                        <div class="item-subtitle decter-belong-unit">
                                            ` +  common.transNullundefined(datalist[i].orgName) + `
                                        </div>
                                    </div>
                                    <div class="decter-pic-con">
                                        <img src="` + picDecterNo(logoimage) + `" class="myicon" style="width:100%;max-height:60px;">
                                    </div>
                                    </a>
                                </li>
                                `);
                                $("#isFocus-"+datalist[i].id).css("color","#F02020");
                            }
                        }
                        if(userInfor.isMuilUnitUser == 0){
                            jQuery(".decter-belong-unit").hide();
                        }else{
                            //是多联网角色切换到单的
                            if(isChangeUnitRole){
                                jQuery(".decter-belong-unit").hide();
                            }else{
                                jQuery(".decter-belong-unit").show();
                            }
                        }
                    } else {
                        self.allowInfinite=false;
                        $('#f_preloader').hide();
                        if (self.listIndex == 0) { //暂无数据
                            $("#typeEqList").empty();
                            $("#typeEqList").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                        }
                    }
                });
            },
            //获取重点关注列表
            getFocusFromKi:function(){
                var self = this;
                var $ = self.$$;
                Dao.getImportantQuestionList({
                  userName: userInfor.accountName,
                  organizationIds:userInfor.organizationIds,
                //   isReset:0,
                  status:-1,
                  startTimeStr:"",
                  endTimeStr:"",
                  queryType:1,
                  isCollect:1,
                  account:userInfor.accountName,
                  pageIndex:self.pageIndex,
                  pageSize:self.pageSize
                },function(data){
                  if(data && data.length>0){
                    //没分页
                    if(data.length<=self.pageSize){
                      $("#f_preloader").hide();
                      self.isInfinite = false;
                    }else {
                      $("#f_preloader").show();
                      self.isInfinite = true;
                    }
                    $("#typeKeyIssList").empty();
                    for(var i=0;i<data.length;i++){
                      keyIssuesListData_rdsp[data[i].id] = data[i];
                      if(data[i].questionType==1 || data[i].questionType==2){ //消控室无人值守
                        var dealHtml="";
                        var alertHtml="";
                        //判断是否完成
                        if(data[i].status==0){
                          dealHtml=`<div class="bottom-right" data-id="`+data[i].id+`"><div style="margin-right:15px">立即处理</div><div  class="handleright">
                            <i class="iconfont icon-youjiantoushixinxiao"></i>
                              </div></div>`;
                          alertHtml="";
                        }else{
                          dealHtml="";
                          alertHtml="<img class='highDanger-item-overtime-img' style='left:8%' src='/ilink-app-h5-zd/static/img/rdspFile_1554726645262.png'/>";
                        }
                        $("#typeKeyIssList").append(`
                          <li class="highDager_detail" data-id="`+data[i].id+`">
                            <div class="item-fireHazardList-list">
                                `+alertHtml+`
                                <img class="highDanger-item-img" src="`+picNo(data[i].detailPic)+`"/>
                                <div class="keyIssues-item-type-title">`+common.transNullundefinedToline(data[i].questionTypeName)+`</div>
                                <div class="highDanger-item-desc">`+common.transNullundefinedToline(data[i].selfDesc)+`</div>
                                <div class="highDanger-item-unit-desc" style="margin-left:0px"><i class="iconfont icon-APPicon_dingwei" style="color:#2471CA;margin-left:-3px;margin-right:5px;font-size:15px;"></i><span class="highDanger-item-unit">`+common.transNullundefinedToline(data[i].organizationName)+`</span></div>
                                <div class="myfocunson-item-interval-time" style="margin-left:0px">已持续`+data[i].intervalTime+` `+dealHtml+`</div>  
                            </div>
                          </li>
                        `);
                      }else if(data[i].questionType==4 || data[i].questionType==5){
                        var dealHtml="";
                        var alertHtml="";
                        //判断是否完成
                        if(data[i].status==0){
                          dealHtml=`<div class="bottom-right" data-id="`+data[i].id+`"><div style="margin-right:15px">立即处理</div><div  class="handleright">
                            <i class="iconfont icon-youjiantoushixinxiao"></i>
                              </div></div>`;
                          alertHtml="";
                        }else{
                          dealHtml="";
                          alertHtml="<img class='highDanger-item-overtime-img' style='left:8%' src='/ilink-app-h5-zd/static/img/rdspFile_1554726645262.png'/>";
                        }
                        $("#typeKeyIssList").append(`
                          <li class="highDager_detail" data-id="`+data[i].id+`">
                            <div class="item-fireHazardList-list">
                                `+alertHtml+`
                                <div class="item-fireHazardList-num">
                                    <div>
                                    <p style="font-size:60px">`+common.transNullundefinedToline(data[i].statusCount)+`</p>
                                    <p style="font-size:12px">处故障</p>
                                    </div>
                                </div>
                                <div class="myfocunson-item-type-title">`+common.transNullundefinedToline(data[i].questionTypeName)+`</div>
                                <div class="myfocunson-item-desc">`+common.transNullundefinedToline(data[i].selfDesc)+`</div>
                                <div class="highDanger-item-unit-desc" style="margin-left:0px"><i class="iconfont icon-APPicon_dingwei" style="color:#2471CA;margin-left:-3px;margin-right:5px;font-size:15px;"></i><span class="highDanger-item-unit">`+common.transNullundefinedToline(data[i].organizationName)+`</span></div>
                                <div class="myfocunson-item-interval-time" style="margin-left:0px">已持续`+data[i].intervalTime+` `+dealHtml+`</div>  
                            </div>
                          </li>
                        `);
                      }else{//消防通道堵塞&&重要消防设施警情
                        var dealHtml="";
                        var alertHtml="";
                        //判断是否完成
                        if(data[i].status==0){
                          dealHtml=`<div class="bottom-right" data-id="`+data[i].id+`"><div style="margin-right:15px">立即处理</div><div class="handleright">
                            <i class="iconfont icon-youjiantoushixinxiao"></i>
                              </div></div>`;
                          alertHtml="";
                        }else{
                          dealHtml="";
                          alertHtml="<img class='highDanger-item-overtime-img' style='left:8%' src='/ilink-app-h5-zd/static/img/rdspFile_1554726645262.png'/>";
                        }
                        $("#typeKeyIssList").append(`
                          <li class="highDager_detail" data-id="`+data[i].id+`">
                            <div class="item-fireHazardList-list">
                                `+alertHtml+`
                                <img class="highDanger-item-img" src="`+picNo(data[i].detailPic)+`"/>
                                <div class="myfocunson-item-type-title">`+common.transNullundefinedToline(data[i].questionTypeName)+`</div>
                                <div class="myfocunson-item-desc">`+common.transNullundefinedToline(data[i].selfDesc)+`</div>
                                <div class="highDanger-item-unit-desc" style="margin-left:0px"><i class="iconfont icon-APPicon_dingwei" style="color:#2471CA;margin-left:-3px;margin-right:5px;font-size:15px;"></i><span class="highDanger-item-unit">`+common.transNullundefinedToline(data[i].organizationName)+`</span></div>
                                <div class="myfocunson-item-interval-time">已持续`+data[i].intervalTime+` `+dealHtml+`</div>  
                            </div>
                          </li>
                        `);
                      }
                      jQuery(".highDager_detail").off().click(function(event) {
                          var id = jQuery(event.currentTarget).attr("data-id")
                          app.router.navigate("/keyIssuesDetail/"+id+"/0/");
                      });
                    }
                  }else{
                	  self.allowInfinite=false;
                      $('#f_preloader').hide();
                      if (self.listIndex == 0) { //暂无数据
                          $("#typeKeyIssList").empty();
                          $("#typeKeyIssList").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                      }
                  }
                });
            },
            //获取接处警数据列表
            getHistoryPoliceList:function(){
                var self = this;
                var $ = self.$$;       
                let params={
                    orgIds:self.historyOrgId,
                    categoryId:self.fcfCategoryId==-1?"":self.fcfCategoryId,
                    fireBuildingId:self.fireBuildingId==-1?"":self.fireBuildingId,
                    fireTType:self.fireTTypes==-1?"":self.fireTTypes, // 报警分类
                    pageIndex:self.pageIndex,
                    pageSize:self.pageSize,
                    startTime: self.startTime,
                    endTime:self.endTime,
                    queryContent:self.selectContent, // 消防设施名称、位置
                    handlerStatus:self.isDeal==""?"":self.isDeal, // 处理状态
                    dataType:self.isRest==-1?"":self.isRest, // 是否复位、 0实时/1历史
                    continueTimeUnit:3,
                    isCollect:1,
                    account:userInfor.accountName,
                }
                for(var k in params){
                    if(params[k]===''){
                        delete params[k]
                    }
                }         
                Dao.getFcfHistroyDataList(params,function(_data,total){
                    let data=_data?_data.listData:[]
                  if(self.pageIndex==0){
                      $("#typeHisPolList").empty();
                  }
                  if (data&&data.length > 0) {
                      if (self.pageSize * self.pageIndex + data.length < total) { //没分页
                          $("#f_preloader").show();
                          self.allowInfinite = true;
                      } else {  //有分页
                          $("#f_preloader").hide();
                          self.allowInfinite = false;
                      }
                      for(var i=0;i<data.length;i++){
                          //  10 火警 20 故障 30 屏蔽 40联动
                          var statueimage = '';
                          if (self.fireTTypes == -1) { //全部 选最高级
                              if (data[i].fireTTypes.indexOf("10") == 0){
                                  statueimage = staticPath + "img/dectorState/alarm_bq.png";
                              } else if (data[i].fireTTypes.indexOf("20") == 0) {
                                  statueimage = staticPath + "img/dectorState/fault_bq.png";
                              } else if (data[i].fireTTypes.indexOf("30") == 0) {
                                  statueimage = staticPath + "img/dectorState/shield_bq.png";
                              }else{//复位
                                  statueimage = staticPath + "img/dectorState/normal_bq.png";
                              }
                          } else {
                              if (self.fireTTypes == 0) { //正常
                                  statueimage = staticPath + "img/dectorState/normal_bq.png";
                              }
                              else if (self.fireTTypes == 10) { //报警
                                  statueimage = staticPath + "img/dectorState/alarm_bq.png";
                              }
                              else if (self.fireTTypes == 20) {//故障
                                   statueimage = staticPath + "img/dectorState/fault_bq.png";
                              }
                              else if (self.fireTTypes == 30) {//屏蔽
                                   statueimage = staticPath + "img/dectorState/shield_bq.png";
                              }
                          }
                          var imageName = staticPath+"img/mine/defEqIcon.png";
                          if (data[i].icon && data[i].icon!=""){
                              imageName = JSON.parse(data[i].icon).detailIcon;
                          }
                          
                          var dealResultHtml="";
                          if(data[i].isReset==0){
                              dealResultHtml+=`&nbsp;&nbsp;未复位`;
                          }else{
                              dealResultHtml+=`&nbsp;&nbsp;已复位`; 
                          }

                          if(data[i].handlerStatus==-1 && data[i].fireTType==10){
                              dealResultHtml+=`&nbsp;&nbsp;未处理`;
                          }else if(data[i].handlerStatus==2 && data[i].fireTType==10){
                              dealResultHtml+=`&nbsp;&nbsp;处理中`;
                          }else if(data[i].handlerStatus==1 && data[i].fireTType==10){
                              dealResultHtml+=`&nbsp;&nbsp;已处理`; 
                          }
                          $("#typeHisPolList").append(`
                              <li>
                                  <div class="decter-stuts-con">
                                      <span class='left'> `+dealResultHtml+ `</span>
                                  </div>
                                  <a href="/policeHistoryDetail/` + data[i].fcFacilitiesId + `/` + data[i].id + `/` + data[i].createTime + `/" class="item-link item-content" data-view=".view-main">
                                      <div class="item-inner" style="padding: 0;">
                                          <div class="item-title-row" style="padding-right: 0;">
                                              <div class="item-title decter-name-con">
                                                  <span class="decter-name">`+common.transNullundefinedToline(data[i].fcFacilitiesName)+ `</span>
                                              </div>
                                          </div>
                                          <div class="item-subtitle decter-mesage">` + common.transNullundefined(data[i].fcfLocation) + `</div>
                                          <div class="item-subtitle decter-belong-unit">
                                              <i class="iconfont icon-dingweiweizhi" style="color: #2471CA;font-size: 14px;"></i>
                                              ` +  common.transNullundefined(data[i].organizationName) + `
                                          </div>
                                      </div>
                                      <div class="decter-pic-con">
                                          <img src="` + picDecterNo(imageName) + `" class="myicon" style="width: 60px;max-height: 60px;">
                                      </div>
                                  </a>
                                  <div class="decter-stuts-con" style="padding-left: 15px;">
                                      <span class='left' style="font-size:12px;">
                                          <i id="fireType-`+data[i].id+`" class="iconfont `+transNewFireIcon(data[i].fireTTypes)+`" style="color:`+transFireColor(data[i].fireTTypes)+`"></i>
                                          `+transFireColorText(data[i].fireTTypes)+ `
                                          <span style="color:#999;">持续` + common.transNullundefined(data[i].durationTime) + `</span>
                                      </span>
                                      <span class='right' style="font-size:12px;" id="deal-btn-`+data[i].id+`"
                                      data-id = `+data[i].id+`
                                      data-createTime = `+data[i].createTime+`
                                      data-handlerStatus = `+data[i].handlerStatus+`
                                      data-organizationId = `+data[i].organizationId+`
                                      >立即处理</span>
                                  </div>
                              </li>
                          `);

                          //立即处理
                          if(data[i].handlerStatus == -1){
                              $("#deal-btn-"+data[i].id).show().html("立即处理");
                              $("#deal-btn-"+data[i].id).click(function(data){
                                  var id = $(this).attr("data-id");
                                  var createTime = $(this).attr("data-createTime");
                                  var handlerStatus = $(this).attr("data-handlerStatus");
                                  var organizationId = $(this).attr("data-organizationId");
                                  app.router.navigate(`/immediateAtten/`+id+`/`+moment(createTime).format("YYYY-MM-DD HH:mm:ss")+`/`+handlerStatus+`/`+organizationId+`/`);
                              });
                          }else if(data[i].handlerStatus == 1){
                              $("#deal-btn-"+data[i].id).hide().html("");
                          }else{
                              $("#deal-btn-"+data[i].id).show().html("继续处理");
                              $("#deal-btn-"+data[i].id).click(function(data){
                                  var id = $(this).attr("data-id");
                                  var createTime = $(this).attr("data-createTime");
                                  var handlerStatus = $(this).attr("data-handlerStatus");
                                  var organizationId = $(this).attr("data-organizationId");
                                  app.router.navigate(`/immediateAtten/`+id+`/`+moment(createTime).format("YYYY-MM-DD HH:mm:ss")+`/`+handlerStatus+`/`+organizationId+`/`);
                              });
                          }
                      }
                  } else {
                	  self.allowInfinite=false;
                      $('#f_preloader').hide();
                      if (self.listIndex == 0) { //暂无数据
                          $("#typeHisPolList").empty();
                          $("#typeHisPolList").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                      }
                  }
                });
              },
              //获取隐患列表
              getHiddenListData:function(){
                  var self = this;
                  var $ = self.$;
                  Dao.getHidDangerList({
                      orgIds:userInfor.organizationIds,//隐患单位
                      categoryId:self.categoryId,//隐患类别
                      gradeId:self.gradeId,//隐患等级
                      status:0,//隐患状态
                      queryType:1,
                      pageIndex:self.pageIndex,
                      pageSize:self.pageSize,
                      startTime:self.startTimeStr,
                      endTime:self.endTimeStr,
                      isCollect:1,
                    //   account:userInfor.accountName
                  },function(data) {
                      if(self.pageIndex==0){
                          $("#typeTroubleList").empty();
                      }
                      if (data && data.length > 0){
                          if (data.length == self.pageSize){
                              $("#f_preloader").show();//有分页
                          } else {
                              $("#f_preloader").hide();//没分页
                          }
                          for (var i=0;i<data.length;i++) {
                                var isMoreUnit='none';
                                if(userInfor.isMuilUnitUser==1){
                                    isMoreUnit='block';
                                }
                                $("#typeTroubleList").append(`
                                <li id="complete-list-`+data[i].id+`">
                                    <div style="padding: 15px;"> 
                                        <div id="tb-scene-image`+data[i].id+`"></div>
                                        <div id="troubledes_appint`+ data[i].id +`"></div>
                                        <div class="yh-list">
                                            <span class="eqType" >`+common.transNullundefinedToline(data[i].categoryName)+`</span>
                                            <div class="tb-details">`+common.transNullundefinedToline(data[i].hiddenDangerDesc)+`</div>
                                        </div>
                                        <div id="complete`+ data[i].id +`">
                                            <div class="right-col clearfix">
                                                <div class="time-con">`+common.transNullundefinedToline(data[i].createTime)+`<span>`+common.transNullundefinedToline(data[i].gradeName)+`</span><span>`+common.transNullundefinedToline(data[i].categoryName)+`</span></div>
                                            </div>
                                            <div class="right-col clearfix"  style="display: `+isMoreUnit+`">
                                                <i class="iconfont icon-dingweiweizhi" style="color:#2471CA;font-size: 13px;"></i> 
                                                <div class="time-con" style="position:absolute;top:3px;left:18px;">`+common.transNullundefinedToline(data[i].orgName)+`</div>
                                            </div>
                                        </div>
                                    </div>
                                </li>`);

                                //展示图片
                                showImage(jQuery("#tb-scene-image"+data[i].id),data[i].picUrls);
                                //语音
                                showVoiceBtn("#troubledes_appint"+data[i].id,data[i].voiceLength,data[i].hiddenDangerVoice);
                                //语音
                                let isFirstView = false; 
                                //页面跳转
                                jQuery("#complete-list-"+data[i].id).off("click").on("click",{'tbId':data[i].id},function(e) {
                                    if(!isFirstView){
                                        var tbId = e.data.tbId;
                                        app.router.navigate("/finishMsg/"+tbId+"/");
                                    }
                                    isFirstView = false;
                                });
                          }
                      } else { //暂无数据
                            $("#f_preloader").hide();
                            if (self.pageIndex == 0) {
                        	    $("#typeTroubleList").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                            }
                      }
                  });
                },
                //获取视频数据 
                getVedioList:function(){
                    let self = this;
                    let $ = self.$$;
                    self.moreUnitlist = [];
                    Dao.equipment({
                    	 orgIds:userInfor.organizationIds,
                         userAccount:userInfor.accountName,
                         type:"2"
                    },function(data){
                      if(data && data.length>0){
                        if (data.length < self.pageSize) {
                            $("#f_preloader").hide();
                            self.isloadMore = false;
                        }else{
                            $("#f_preloader").show();
                            self.isloadMore = true;
                        }
                        self.moreUnitlist = data;
                      }
                      self.showUnitList();
                    });
                },
                //显示视频列表
                showUnitList:function(){
                  let self = this;
                  let $ = self.$$;
                  let data = self.moreUnitlist;
                  let $el = $("#typeVideoList");
                  jQuery("#otherVedioTitle,#myFocusVedioTitle").hide();
                  $el.empty();
                  if(data.length>0){
                    for(let i=0;i<data.length;i++){
                        let status = "";
                        let stick_name="";
                        let stick_img= "";
                        $("#otherVedioTitle").show();
                        //在线
                        if (data[i].isOnline && data[i].isOnline == 1) {
                            status = staticPath + "img/vedio/play.png"
                        }else{
                            status = staticPath + "img/vedio/line.png"
                        }
                        //关注
                        $el.append(`
                            <li class="videoli" id=videoli`+ common.transNullundefined(data[i].id) +` style="padding:0;">
                                <div class="each-vedio-contain">
                                    <div class="each-vedio-pic" style="position: relative;">
                                        <div  id= status_offline_`+common.transNullundefined(data[i].id)+` style="background-color:rgba(0, 0, 0, 0.5);position:absolute;top:12px;left:12px;width:calc(100% - 24px);height:180px;">
                                            <p style="top:0;left:0;width:100%;height:100%;color:#ffffff;position:absolute;font-size: 12px;display: flex;justify-content: center;align-items: center;">视频离线</p>
                                        </div>
                                        <i class="iconfont icon-APPicon_guanzhu iconfont-focus" id="bt_`+data[i].id+`" is-top="`+data[i].isConcem+`" style="font-size:24px"></i>
                                        <img class="vedioImg" id=img_`+common.transNullundefined(data[i].id)+` src=`+picVedioNo(data[i].picUrl)+`
                                        onerror="this.onerror=null; this.src='`+picVedioNo()+`'">
                                        <div class="status_div" id= status_`+common.transNullundefined(data[i].id)+`>
                                            <img class="div_status" src=`+ status +`>
                                        </div>
                                    </div>
                                    <div class="each-vedio-name">
                                        <div class="top">`+common.transNullundefined(data[i].videoName)+`</div>
                                    </div>
                                </div>
                            </li>`);
                            if (data[i].isOnline && data[i].isOnline == 1) {
                                // 在线
                                $('#status_'+data[i].id).show();
                                $('#status_offline_'+data[i].id).hide();
                            }else{
                                // 离线
                                $('#status_'+data[i].id).hide();
                                $('#status_offline_'+data[i].id).show();
                            }
                            //视频播放
                            jQuery('#status_'+data[i].id).off().on("click",{'data':data[i]},function(e) {
                                if(getClickEnabel(2000)){//点击视频列表间隔
                                    var bean = e.data.data;
                                    bean.isConcem = 1;      // 增加关注字段
                                    playCurrentVedio(bean,1);
                                }
                            });
                            jQuery('#bt_'+data[i].id).off("click").on("click",{'data':data[i]},function(e) {
                                self.isFocusVedio(e.data.data);
                            });
                        }
                  } else {
                      if (self.pageIndex == 0) { //暂无数据
                          self.isloadMore = false;
                          $("#f_preloader").hide();
                          $("#typeVideoList").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                      }
                  }
                },
                isFocusVedio:function(data){
                    let self = this;
                    let $ = self.$$;
                    self.vedioData = data;
                    common.loading(1);
                        //视频取消置顶
                        Dao.focusOnOff({
                            userName:userInfor.accountName,
                            deviceId:appKeyObj.deviceId,
                            concemId:self.vedioData.concemId,
                            type:2,
                            userAccount:userInfor.accountName,
                        },function(data) {
                            self.vedioData.isConcem = 0;
                            var status = "";
                            if (self.vedioData.isOnline && self.vedioData.isOnline == 1) {
                                status = staticPath + "img/vedio/play.png"
                            }else{
                                status = staticPath + "img/vedio/line.png"
                            }
                            $("#videoli"+self.vedioData.id).remove();
                            $("#video-list-other").append(`
                                <li class="videoli-other" id=videoli`+ common.transNullundefined(self.vedioData.id) +`>
                                    <div class="each-vedio-contain-other">
                                        <div class="each-vedio-pic">
                                            <img class="vedioImg" id=img_`+common.transNullundefined(self.vedioData.id)+` src=`+picVedioNo(self.vedioData.picUrl)+`
                                            onerror="this.onerror=null; this.src='`+picVedioNo()+`'">
                                            <div class="status_div" id= status_`+common.transNullundefined(self.vedioData.id)+` style="top:calc(50% - 25px);left:calc(50% - 25px);position:absolute">
                                                <img class="div_status" src=`+ status +`>
                                            </div>
                                        </div>
                                        <div class="each-vedio-focus-other">
                                            <a class="stick" href="#" id="bt_`+self.vedioData.id+`" is-top="`+self.vedioData.isConcem+`" style="color:#999;">
                                                <i class="iconfont icon-APPicon_weiguanzhu iconfont-unfocus" style="font-size:24px"></i>
                                            </a>
                                        </div>
                                    </div>
                                    <div class="each-vedio-name1">
                                        <div class="top">`+common.transNullundefined(self.vedioData.organizationName)+`</div>
                                        <div>`+common.transNullundefined(self.vedioData.name)+`</div>
                                    </div>
                                </li>`
                            );
                            common.loading(0);
                            app.methods.showToastCenter('取消视频关注成功');
                            //关注
                            jQuery('#bt_'+self.vedioData.id).off("click").on("click",{'data':self.vedioData},function(e) {
                                self.isFocusVedio(e.data.data);
                            });
                            //视频播放
                            jQuery('#status_'+self.vedioData.id).off().on("click",{'data':self.vedioData},function(e) {
                                if(getClickEnabel(2000)){//点击视频列表间隔
                                    var bean = e.data.data;
                                    playCurrentVedio(bean);
                                }
                            });
                            if(jQuery("#typeVideoList").children().length == 0){
                                if (self.pageIndex == 0) {
                        	        $("#typeVideoList").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                                }
                            }
                        },function(e) {
                            common.loading(0);
                            app.methods.showToastCenter('取消视频关注失败');
                        },true);
                },
                refreshVedio:function(e, done){
                  if (done && e) {
                      var self = this;
                      self.pageIndex = 0;
                      var $ = self.$$;
                      setTimeout(function () {
                          self.moreUnitlist = [];
                          $("#typeVideoList").empty();
                          self.getVedioList();
                          done();
                      },1000);
                  }
                },
            loadMore: function () {
                let self = this;
                let $ = self.$$;
                if (self.allowInfinite){
                    if (!self.allowInfinite) return;
                    self.allowInfinite = false;
                    self.listIndex++;
                    if(self.type==1){
                    	self.getFocusFromKi();
                    }else if(self.type==2){
                    	self.getHistoryPoliceList();
                    }else if(self.type==3){
                    	 self.getFocusFromEq();
                    }else if(self.type==4){
                    	self.getHiddenListData();
                    }else{
                    	self.getVedioList();
                    }
                }
            },
            showCurrentList:function(){
                let self = this;
                $(".eachList").hide();
                //根据传过来的类型调用不同方法
                if(self.type == 1){
                    $("#typeKeyIssList").empty().show();
                    self.getFocusFromKi();
                }else if(self.type == 2){
                    $("#typeHisPolList").empty().show();
                    self.getHistoryPoliceList();
                }else if(self.type == 3){
                    $("#typeEqList").empty().show();
                    self.getFocusFromEq();
                }else if(self.type==4){
                    $("#typeTroubleList").empty().show();
                    self.getHiddenListData();
                }else{
                    $("#typeVideoList").empty().show();
                    self.getVedioList();
                }
                //九小用户
                if(userInfor.role[0].id == 143){
                    self.getNineMarkData();
                }
            },
            refreshCurrentList:function (e, done) {
                var self = this;
                var $ = self.$$;
                if (done && e) {
                    setTimeout(function () {
                        self.listIndex = 0;
                        $('#f_preloader').hide();
                        self.showCurrentList();
                        done();
                    },1000);
                }
            },
        },
        on: {
            pageInit: function (e, page) {
                let self = this;
                self.showCurrentList();
            },
            pageAfterIn: function (e, page) {
            },
        },
    }
</script>
<style scoped>
/*
	隐患样式
*/
.have-root-to{
    position: absolute;
    top: 9px;
    right: 15px;
    font-size: 14px;
}
.overTime-info{
    background-color: rgb(233, 241, 250);
    height: 35px;
    border-radius: 0px 0px 6px 6px;
    font-size: 15px;
    position: relative;
}
.time{
    background-color: rgba(36, 113, 202, 0.5);
    color: #fff;
    padding: 4px 3px;
    padding-right: 5px;
    border-radius: 2px;
    font-family: LcdD;
}
.dot{
    color: rgba(36, 113, 202, 0.6);
    margin: -2px;
}
.overtime{
    background-color: #E07762;
    color: #fff;
    padding: 4px 3px;
    padding-right: 5px;
    border-radius: 2px;
    font-family: LcdD;
}
.overdot{
    color:#E07762;
    margin: -2px;
}
.overtime-icon{
    color: white;
    background-color: red;
    font-size: 9px;
    margin-left: 4px;
    padding: 1px 5px;
    border-radius: 3px;
}
.wait-icon{
    width: 12px;
    height: 12px;
    margin-right: 8px;
}
.myImg{
    width: 28%;
    height: 75px;
    border-radius: 2px;
    padding-right: 10px;
}
.one-pic{
    width: 100%;
    height: 150px;
}
.more-pics{
    height: 75px;
    padding-left: 16px;
}
.ringht-con{
    font-size: 12px;
    margin-left:15px;
}
.appoint-to-do{
    position: absolute;
    right: 15px;
    top: 14px;
    font-size: 14px;
    color: #E07762;
}
.toDo-con{
    background-color: #FCF1EF;
    font-size: 12px;
    padding: 12px 0;
    padding-left: 15px;
    color: #E07762;
}
.toDo-other-con{
    background-color: #E9F1FA;
    font-size: 12px;
    padding: 12px 0;
    padding-left: 15px;
    color: #2471CA;
}
.time-con{
    font-size: 12px;
    color: #999999;  
}
.troubleApply-list li{
    background: #ffffff;
    border: 1px solid rgba(225, 225, 225, 0.9);
    box-shadow: 0px 1px 10px 0px rgba(181, 200, 206, 0.5);
    border-radius: 6px;
    margin: 0;
    margin-bottom: 20px;
}
.tb-voice-after{
    width: 100%;
    height: 35px;
    line-height: 35px;
}
.tb-voice-after-time{
    width: 100%;
    height: 100%;
    color: #fff;
    text-align: left;
    float: left;
    background: #378bf6;
}
.tb-voice-gif{
    height: 16px!important;
    width: 13px!important;
    margin: 3px;
}
.tb-voice-png{
    height: 16px!important;
    width: 13px!important;
    margin: 8px;
}
.md .navbar~* .page-content, .md .navbar~.page-content{
    padding-top: 0px;
}
.text-overflow{
    margin-left: 16px;
    min-height: 48px;
    padding-right: 16px;
    display: -webkit-box!important;
    -webkit-line-clamp: 2!important;
    -webkit-box-orient : vertical!important;
    text-overflow: ellipsis!important;
    overflow: hidden;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    position: relative;
    width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    min-width: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-align: left;
    -webkit-align-items: left;
    -ms-flex-align: left;
    align-items: left;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    font-size: 16px;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    overflow: hidden;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    text-overflow: ellipsis;
    max-height: 48px;
    line-height: 24px;
}
.yh-list .eqType{
    padding: 1px 5px;
    background: #ffc944;
    border-radius: 4px;
    color: #fff;
    font-size: 12px;
    border-radius: 2px;
}
/*
	接处警样式
*/
.select-option {
      padding: 10px 5px;
      background-color: #ffffff;
      font-size: 12px;
      width: 100%;
  }
  .history-type-select {
      width: 100%; 
      height: 40px;
      line-height: 40px;
      background-color: white;
  }
  .history-type-select div {
      text-align: center;
      font-size: 14px;
  }
  .imgicon{
    width: 39px;
    height: 39px;
    border-radius: 5px;
    background: #eaeaea;
  }
  #historyPolice_list .decter-no-border,#historyPolice_list .decter-yes-border{
    display: inline-block;
    height: 20px;
    line-height: 20px;
    padding:0 5px;
  }
  .item-title span {
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
  }
  .click-contaier{
    z-index: 6;
    position: absolute;
    right: 16px;
    top: 18px;
  }
  .maintitle {
      width: 95%;
      padding-left: 5px;
      font-size: 14px;
  }

.img_bqq {
    /*width: 45px;*/
    padding-top: 1.5px;
    height: 17px;
}
.linenumber {
        color: #333333;
        /*padding-top: 5px;*/
        font-size: 15px;
        padding-left: 0px;
        -webkit-line-clamp: 1;
        display: -webkit-box;
        /*-webkit-box-orient: vertical;*/
        overflow: hidden;
        white-space: nowrap;
        width: 100%;
    }
.icon-size{
    font-size: 22px!important;
}
.bottom-right{
    float: right;
    font-size: 14px;
    font-family: PingFangSC-Regular;
    font-weight: normal;
    color: #222222;
    position: relative;
    bottom: 3px;
}
.handleright{
    display: inline-block;
    position: absolute;
    top: 0px;
    right: 0px;
}
.item-fireHazardList-num{
    padding: 21px 0px;
    width: 100%;
    background-color: #F7F7F7;
    color: #F6C039;
    text-align: center;
}
.item-fireHazardList-list{
    background: rgba(255,255,255,1);
    border: 1px solid rgba(225, 225, 225, 0.9);
    box-shadow: 0px 1px 10px 0px rgba(181,200,206,0.5);
    border-radius: 6px;
    padding: 15px 15px 0px 15px;
    position: relative;
}
.myfocunson-item-type-title{
    font-size: 12px;
    margin-top: 10px;
    margin-bottom: 8px;
    color: #2471CA;
}
.myfocunson-item-desc{
    font-size: 14px;
    margin: 5px 0px;
    color: #333333;
}
.highDanger-item-unit-desc{
    margin-left: 0px;
}
.myfocunson-item-interval-time{
    font-size: 12px;
    padding-left: 0px;
    margin-bottom: 10px;
    color: #999999;
    padding-top: 8px;
    border-top: 1px solid rgba(208, 208, 208, 0.3);
}
.decter-pic-con {
    width: 60px;
    height: 60px;
    background: #e7e7e7;
    border: 1px solid #e1e1e1;
    margin-right: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}
</style>